import React, { Component } from 'react';
import style from './index.module.less'
import Axios from '../../axios'

import { formatTime } from '../../utils'

class Header extends Component {
    constructor() {
        super()
        this.state = {
            userName: '1234566',
            time: ''
        }
    }
    componentDidMount() {
        this.getWeatherData()
        setInterval(() => {
            const time = formatTime(new Date())
            this.setState({
                time
            })
        }, 1000)
    }
    getWeatherData() {
        console.log(Axios.jsonp)
        Axios.jsonp({ url: '/api/weather.json'}).then(res => {

        })

    }
    render() {
        return (
            <div className={style.headerWrapper}>
                <div className={style.headerTop}>
                    <div className={style.container}>
                        <div className={style.userBox}>欢迎，{this.state.userName}</div>
                        <div className={style.outBut}>退出</div>
                    </div>
                </div>
                <div className={style.headerFooter}>
                    <div className={style.indexes}>首页</div>
                    <div className={style.promptMsg}>
                        <div className={style.time}>{this.state.time}</div>
                        <div className={style.weather}>
                            <img src="/assets/end_point.png" alt="" />
                            <div className={style.title}>多云转晴</div>
                        </div>
                    </div>
                </div>
            </div>
        );
    }
}

export default Header;
